<template>
  <div>
  </div>

  <div>
    <ElForm :inline="true">
      <ElFormItem>
        <ElInput v-model="queryAInfo.arms" placeholder="原神角色属性类型模糊查询"> </ElInput>
      </ElFormItem>
      <ElFormItem>
        <ElButton v-loading="loading" @click="query" type="primary">查询</ElButton>
        <ElButton v-loading="loading" @click="reset" type="danger">重置</ElButton>
        <ElButton  type="warning">添加</ElButton>
      </ElFormItem>
    </ElForm>
  </div>
  <div v-loading="loading">
    <ElTable :data="list" stripe border>
      <ElTableColumn prop="rid" label="角色编号"></ElTableColumn>
      <ElTableColumn prop="atr" label="角色属性"></ElTableColumn>
      <ElTableColumn label="信息修改时间">
        <template #default="scope">
          {{ Tools.formatDate(scope.row.lastupdate) }}
        </template>
      </ElTableColumn>
      <ElTableColumn label="操作">
        <template #default="scope">
          <ElButton type="primary">修改</ElButton>
          <ElButton type="danger">删除</ElButton>
        </template>
      </ElTableColumn>
    </ElTable>

  
  </div>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import ApiService from '../../ts/ApiService'
import Tools from '../../ts/Tools'
import { BaseResult } from '../../ts/BaseResult'
import { Atr } from '../../ts/Ys'
import { ElDialog, ElButton, ElMessageBox, ElPagination, ElTable, ElTableColumn, ElFormItem, ElInput } from 'element-plus'

const title = ref('原神角色属性管理')

//#region ========查询部分============
const loading = ref(false)
const list = ref(new Array<Atr>())
const queryAInfo = ref({
  atr: '',
})


function reset() {
  queryAInfo.value = {
    atr: '',
  }
  query()
}



function query() {
  ApiService.get('/atr/query', queryAInfo.value, (data: BaseResult<Atr>) => {
    if (data.success) {
      list.value = data.data
      console.log('数据', data)
      return
    }
    ElMessageBox.alert(data.message, '原神角色属性管理')
  })
}
query()

</script>
<style></style>
